<template>
  <div class="Home">
    <mt-swipe :auto="4000" style="height: 200px">
      <mt-swipe-item>
        <div style="height: 100%; width: 100%; background-color: #1da2f0">
          1
        </div>
      </mt-swipe-item>
      <mt-swipe-item>
        <div style="height: 100%; width: 100%; background-color: #ffba21">
          2
        </div>
      </mt-swipe-item>
      <mt-swipe-item>
        <div style="height: 100%; width: 100%; background-color: crimson">
          3
        </div>
      </mt-swipe-item>
    </mt-swipe>
    <h1>m home</h1>
    <hr />
    <h1>count: {{ $store.state.count }}</h1>
    <h1>countX10: {{ $store.getters.countX10 }}</h1>
    <button @click="$store.commit('set_count')">count++</button>
    <hr />
    <mt-button type="default">default</mt-button>
    <mt-button type="primary">primary</mt-button>
    <mt-button type="danger">danger</mt-button>

    <hr />

    <van-button type="primary">主要按钮</van-button>
    <van-button type="info">信息按钮</van-button>
    <van-button type="default">默认按钮</van-button>
    <van-button type="warning">警告按钮</van-button>
    <van-button type="danger">危险按钮</van-button>
  </div>
</template>

<script>
export default {
  name: "MHome",
};
</script>

<style scoped></style>
